<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<lv-form [formGroup]="formGroup" class="formGroup">
    <lv-form-column lvWidth="40%">
        <lv-form-item>
            <lv-form-label lvRequired>
                {{'protection_project_name_label' | i18n}}
            </lv-form-label>
            <lv-form-control [lvErrorTip]="nameErrorTip" class="resourceset-error">
                <input lv-input type="text" formControlName="name" style="width:372px">
            </lv-form-control>
        </lv-form-item>
    </lv-form-column>
    <lv-form-column lvWidth="40%" *ngIf="false">
        <lv-form-item>
            <lv-form-label>
                {{'system_label_filter_label' | i18n}}
            </lv-form-label>
            <lv-form-control>
                <lv-select [lvOptions]="[]" lvValueKey="value" formControlName="filter" lvShowFilter lvFilterKey="label"
                    lvFilterMode="contains"></lv-select>
            </lv-form-control>
        </lv-form-item>
    </lv-form-column>
    <lv-form-item style="margin-top:24px">
        <lv-form-label>
            {{'system_resource_set_desc_label' | i18n}}
        </lv-form-label>
        <lv-form-control [lvErrorTip]="descErrorTip">
            <lv-input-lint style="width:368px">
                <textarea lv-input formControlName="desc" lvMaxLength="255" [lvAutosize]="{ minRows: 2, maxRows: 6 }"
                    style="width: 368px"></textarea>
            </lv-input-lint>
        </lv-form-control>
    </lv-form-item>
</lv-form>

<div class="select-header">
    <h2>{{'protection_select_resources_label' | i18n}}</h2>
</div>

<lv-tabs>
    <ng-container *ngFor="let item of applicationList">
        <ng-container [ngSwitch]="item.type">
            <ng-container *ngSwitchCase="resourceSetType.Agent">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <aui-client-template [allSelectionMap]="allSelectionMap" [data]="data"
                            (allSelectChange)="selectChange($event)"></aui-client-template>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchCase="resourceSetType.SLA">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <aui-sla-template [subName]="'SLA'" [allSelectionMap]="allSelectionMap" [data]="data"
                            (allSelectChange)="selectChange($event)"></aui-sla-template>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchCase="resourceSetType.QOS">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <aui-qos-template [allSelectionMap]="allSelectionMap" [data]="data"
                            (allSelectChange)="selectChange($event)"></aui-qos-template>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchCase="resourceSetType.AirGap">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <aui-airgap-tactics [allSelectionMap]="allSelectionMap" [data]="data" [isResourceSet]="true"
                            (allSelectChange)="selectChange($event)"></aui-airgap-tactics>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchCase="resourceSetType.LiveMount">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <aui-mount-update-policy [allSelectionMap]="allSelectionMap" [data]="data"
                            [isResourceSet]="true" (allSelectChange)="selectChange($event)"></aui-mount-update-policy>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchCase="resourceSetType.Worm">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <aui-anti-policy [allSelectionMap]="allSelectionMap" [data]="data"
                            (allSelectChange)="selectChange($event)" [isResourceSet]="true"></aui-anti-policy>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchCase="resourceSetType.Report">
                <lv-tab [lvTitle]="tabTitleTpl">
                    <ng-template lv-tab-lazy>
                        <lv-tabs lvType="underline">
                            <lv-tab [lvTitle]="'common_report_label'|i18n">
                                <aui-reports-list [allSelectionMap]="allSelectionMap" [data]="data"
                                    [isResourceSet]="true" (allSelectChange)="selectChange($event)"></aui-reports-list>
                            </lv-tab>
                            <lv-tab [lvTitle]="'insight_report_subscription_label'|i18n">
                                <aui-reports-subscription [allSelectionMap]="allSelectionMap" [data]="data"
                                    [isResourceSet]="true"
                                    (allSelectChange)="selectChange($event)"></aui-reports-subscription>
                            </lv-tab>
                        </lv-tabs>
                    </ng-template>
                </lv-tab>
            </ng-container>
            <ng-container *ngSwitchDefault>
                <lv-tab [lvTitle]="tabTitleTpl">
                    <lv-alert lvType="info"
                        *ngIf="!!item?.key && item.key === 'virtualization'">{{'system_resourceset_virtual_tip_label' |
                        i18n}}</lv-alert>
                    <lv-collapse [lvMultiExpansion]="false" [lvBeforeExpanded]="beforeExpanded"
                        [lvAfterCollapsed]="afterCollapse">
                        <ng-container *ngFor="let app of item.apps">
                            <lv-collapse-panel [lvTitle]="collapseTitleTpl" *ngIf="!virtualCloudApp.includes(app.slaId)"
                                lvId="{{app.label}}" [lvExtra]="!app.showAllSelect ? null:extraTpl">
                                <!-- 有多层子资源的应用 -->
                                <lv-tabs
                                    *ngIf="!singleLayerApp.includes(app.slaId) && !virtualCloudApp.includes(app.slaId)">
                                    <ng-container *ngFor="let tab of app?.tabs">
                                        <lv-tab lvTitle="{{tab.label}}">
                                            <aui-normal-resourceset-template [resourceType]="tab.resType"
                                                [tableLabel]="tab.label" [subName]="app.label"
                                                [allSelectionMap]="allSelectionMap" [appType]="app.resourceSetType"
                                                [data]="data" [allSelect]="!!app?.allSelect"
                                                (allSelectChange)="selectChange($event)"></aui-normal-resourceset-template>
                                        </lv-tab>
                                    </ng-container>
                                </lv-tabs>
                                <!-- 只有一类子资源的应用 -->
                                <ng-container *ngIf="singleLayerApp.includes(app.slaId)">
                                    <aui-normal-resourceset-template [resourceType]="app.resType" [subName]="app.label"
                                        [allSelectionMap]="allSelectionMap" [appType]="app.resourceSetType"
                                        [data]="data" [allSelect]="!!app?.allSelect"
                                        (allSelectChange)="selectChange($event)"></aui-normal-resourceset-template>
                                </ng-container>
                            </lv-collapse-panel>
                            <lv-collapse-panel [lvTitle]="collapseTitleTpl"
                                [lvExtra]="!app.showAllSelect ? null:extraTpl"
                                *ngIf="virtualCloudApp.includes(app.slaId)" lvId="{{app.label}}">
                                <!-- 虚拟化和云平台的应用模板 -->
                                <aui-virtual-cloud-template [resourceType]="app.resType" [subName]="app.label"
                                    [allSelectionMap]="allSelectionMap" [appType]="app.resourceSetType" [data]="data"
                                    [allSelect]="!!app?.allSelect"
                                    (allSelectChange)="selectChange($event)" (resourceGroupChange)="resourceGroupChange($event)"></aui-virtual-cloud-template>
                            </lv-collapse-panel>
                            <ng-template #extraTpl>
                                <!-- 用于右侧全选 -->
                                <div>
                                    <lv-group lvGutter="4px">
                                        <span class="aui-link" *ngIf="!app.allSelect"
                                            (click)="selectAll($event, app)">{{'system_resourceset_all_select_label' |
                                            i18n}}</span>
                                        <span class="aui-link" *ngIf="!!app.allSelect"
                                            (click)="cancelSelectAll($event, app)">{{'system_resourceset_cancel_all_select_label'
                                            | i18n}}</span>
                                    </lv-group>
                                </div>
                            </ng-template>
                            <ng-template #collapseTitleTpl>
                                <!-- 用于应用已选展示 -->
                                <lv-group lvGutter="4px" class="resourceset-tag">
                                    <span>{{app.label}}</span>
                                    <lv-tag lvAlarmStatus="minor"
                                        *ngIf="!!app?.selected">{{'common_selected_simple_label' | i18n}}</lv-tag>
                                </lv-group>
                            </ng-template>
                        </ng-container>
                    </lv-collapse>
                </lv-tab>
            </ng-container>
        </ng-container>
        <ng-template #tabTitleTpl>
            <ng-container *ngIf="!!item?.selected">
                <lv-group lvGutter="4px" class="resourceset-tag">
                    <span>{{item.label}}</span>
                    <lv-tag lvAlarmStatus="minor">{{'common_selected_simple_label' | i18n}}</lv-tag>
                </lv-group>
            </ng-container>
            <ng-container *ngIf="!item?.selected">
                <span>{{item.label}}</span>
            </ng-container>
        </ng-template>
    </ng-container>
</lv-tabs>